<template>
    <div class="h-full flex flex-col justify-evenly">
        <div class="Serif-Bolder text-3xl text-center my-4">
            欢迎来到 Code Snippets
        </div>
        <van-tabs
            v-model="activeName"
            class="h-full flex flex-col justify-evenly"
        >
            <van-tab class="h-full" title="登录" name="signIn">
                <SignIn class="h-full"></SignIn>
            </van-tab>
            <van-tab title="注册" name="signUp">
                <SignUp class="h-full"></SignUp>
            </van-tab>
        </van-tabs>
    </div>
</template>

<script>
import SignUp from "./signUp";
import SignIn from "./signIn";
import { mapActions } from "vuex";
export default {
    components: {
        SignUp,
        SignIn,
    },
    data() {
        return {
            activeName: "signIn",
            needConfirm: false,
        };
    },
    watch: {
        "$store.state.user.user.info"(info) {
            console.log("页面跳转", info);
            if (info) this.$router.push({ name: "Logined" });
        },
    },
    mounted() {
        if (this.$store.state.user.user.info)
            this.$router.push({ name: "Logined" });
    },
    methods: {
        ...mapActions(["SignIn", "SignUp"]),
        async upload() {
            const isEmail = this.input.username.match(/@/);
            const data = { type: isEmail ? "email" : "user", ...this.input };
            if (this.activeName === "signIn") {
                await this.SignIn(data);
            } else {
                const err = await this.SignUp(data);
                console.error(err);
                this.needConfirm = true;
            }
        },
    },
};
</script>

<style lang="less" scoped>
/deep/ .van-tab--active {
    background-color: #fafafa;
}
</style>
